Event Loop

❓질문

이벤트 루프에 대해서 설명해주세요.


💡 조사하기전 내가 알고 있던 내용

먼저 자바스크립트의 엔진은 메모리 힙( 실행 컨텍스트가 쌓임 ) 콜스택 ( 할 일이 쌓임 )으로 이루어져있습니다 여기서 자바스크립트는 싱글스레드 언어이므로 한번의 하나의 일밖에 못합니다 고로 할일이 스택형태로 쌓이게 되는데 우리가 비동기 작동하는 함수의 경우에 이 콜스택에 쌓였다가 태스크 큐라는곳으로 이동을합니다 그리고 동기적으로 작동하는 함수가 다 진행되고 콜스택이 비어졌을때 태스크 큐에 쌓인 비동기 함수가 콜스택으로 하나씩 올라가고 다시 비어지면 하나 올라가는 식으로 관리해주는 매커니즘이 이벤트루프입니다.


🏫 정리한 내용

자바스크립트의 엔진은 메모리 힙콜스택으로 이루어져있습니다.
메모리힙은 실행컨텍스트의 정보가 담기고 콜스택은 코드가 실행되는 할일들에 대한 정보가 쌓입니다.
이때 동기로 실행되는 함수들은 그대로 있지만 비동기로 작동하는 함수의 경우에는 콜슽액에 들어갔다가 따로 태스크 큐로 빠집니다. 먼저 동기함수부터 처리한 이후에 이벤트 루프가 비어진 콜스택을 확인하고 태스크 큐에서 비동기 함수를 꺼내 콜스택으로 올리고 다시 비어지면 올려주는 감독관 역할을 맡고있습니다.
이런 매커니즘 덕분에 자바스크립트는 싱글스레드 기반 언어임에도 불구하고 비동기 작업을 처리 할수 있게 해줍니다.

태스크 큐에는 마이크로 태스크 큐와 매크로 태스크 큐로 나뉩니다
전자는 promise.then()등이 담기며 우선순위가 높습니다.
후자는 일반적인 비동기 작업이 담깁니다. (setTimeout, fetch , async)